<template>
  <div class="overview-content">
    <el-row :gutter="32">
      <el-col :xs="24" :sm="24" :lg="24" style="margin-bottom: 20px">
        <div class="chart-wrapper">
          <el-table
            :data="list"
            style="width: 100%"
            class="card-table"
            :border="false"
            stripe
            :default-sort="{ prop: 'five' }"
          >
            <el-table-column
              show-overflow-tooltip
              type="index"
              label="序号"
              min-width="50%"
              align="center"
            />

            <el-table-column
              show-overflow-tooltip
              label="操作记录"
              prop="content"
              max-width="100"
              align="center"
            />
            <el-table-column
              show-overflow-tooltip
              prop="houseAddress"
              label="房源"
              align="center"
            >
              <template slot-scope="scope">
                <!-- <span class="cp">{{scope.row.houseAddress}}</span> -->
                <router-link :to="{path: '/house/pageDetail', query:{'id':scope.row.houseId}}" class="linkBtn">
                  <span class="houseNum cp">{{ scope.row.houseAddress }}</span>
                </router-link>
              </template>
            </el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="createdBy"
              label="操作人"
              align="center"
            />
            <el-table-column
              show-overflow-tooltip
              prop="type"
              label="记录类别"
              align="center"
              :formatter="tel"
            />
            <el-table-column
              show-overflow-tooltip
              prop="createdTime"
              label="操作时间"
              align="center"
              width="200"
              :formatter="formatDot"
            >
              <template slot-scope="scope">
                <span>{{ formatDot(scope.row.createdTime) }}</span>
              </template>
            </el-table-column>
          </el-table>
          <el-pagination
            :v-show="total > 0"
            background
            :current-page="currentPage"
            :page-sizes="[10, 20, 50,100]"
            :page-size="pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
          />
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { pagelog, pagelogSel } from '@/api/manager'

import {
  formatDot,
  dateFormatRow,
  myTime,
  genderFormat,
  ownerSourceFormat
} from '@/utils/common'

export default {
  components: {},
  data() {
    return {
      formatDot,
      genderFormat,
      ownerSourceFormat,
      myTime,
      dateFormatRow,
      currentPage: 1,
      pageSize: 10,
      total: 0,
      list: [],
      sizeForm: {},
      radio: 3,
      listQuery: {
        page: 1,
        limit: 10,
        content: null,
        createdBy: null,
        type: null
      }
    }
  },
  watch: {
    currentPage: {
      handler(newVal) {
        newVal && this.getList()
      }
    },
    pageSize: {
      handler(newVal) {
        newVal && this.getList()
      }
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      this.loading = true
      // const query = { page: this.currentPage, limit: this.pageSize, type: 0 }
      pagelog(this.listQuery).then((response) => {
        console.log(response, 666)
        this.list = response.data.records
        this.total = response.data.total
        this.loading = false
      })
    },
    srcGetList(params) {
      this.loading = true
      if (params.createdBy === '') {
        params.createdBy = null
      }
      if (params.type === '') {
        params.type = null
      }
      if (params.type === '') {
        params.type = null
      }
      if (params.endTime === '') {
        params.endTime = null
      }
      if (params.startTime === '') {
        params.startTime = null
      }
      pagelog(params).then((response) => {
        this.list = response.data.records
        this.total = response.data.total
        this.loading = false
      })
    },
    tel(val) {
      return val.type == 0 ? '系统记录' : '人工记录'
    },
    handleClick(row) {
      this.objMo.show = true
      this.$emit('showModal', row)
    },
    handleSizeChange(val) {
      this.pageSize = val
      this.listQuery.limit = val
    },
    handleCurrentChange(val) {
      this.currentPage = val
      this.listQuery.page = val
    },

    houseTypeFormat(row) {}
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-table th.is-leaf,
::v-deep .el-table td,
::v-deep .el-table__body {
  border: 0;
}

::v-deep .el-table::before,
::v-deep .el-table__fixed-right::before {
  display: none;
}

::v-deep th {
  background: #f7f7f7;
  font-weight: normal;
  color: #101010;
}

.houseNum {
  font-size: 13px;
  color: #6BA9FB;
}

::v-deep .el-table th {
  background: #f7f7f7;
}
.cp{color: #6BA9FB;}
.el-table th > .cell{font-size: 14px;color: #101010;}
</style>

